<?
        require_once('../inc/facebook.php');
		require_once('../inc/products.php');
		require_once('../inc/orderitems.php');
		if(isset($_POST['Price']))
			$p = ($_POST['Price'])*($_POST['ProductQuantity']);
		else
			$p = 0;
		if(isset($_POST['ProductQuantity']))
			$c = $_POST['ProductQuantity'];
		else
			$c = 0;
			
		session_start();

		if(isset($_SESSION['total']))
			$_SESSION['total'] = $_SESSION['total']+$p;
		else
			$_SESSION['total'] = $p;
		if(isset($_SESSION['count']))
			$_SESSION['count'] = $_SESSION['count']+$c;
		else
			$_SESSION['count'] = $c;
			
		if(isset($_POST['reset'])){
			$_SESSION['total']=0;
			$_SESSION['count']=0;	
		}
			
        $facebook = new Facebook(array(
                'appId' => '133491496805876',
                'secret' => '75ca045c26d2ad30854e7cde4ebffa94'
        ));
       
        $fbUser = $facebook->getUser();
        //echo $facebook->getAccessToken();
		
		$results = GetProducts();
		$cart= GetOrderItems();
		
			

?>

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <link rel="stylesheet" type="text/css" href="../inc/bootstrap.css">
    <script type = "text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script>
    <link rel="stylesheet" type="text/css" href="http://code.jquery.com/ui/1.9.1/themes/base/jquery-ui.css">
    <script type = "text/javascript" src="inc/drop.js"></script>
    <link href="inc/styles.css" rel="stylesheet" type="text/css" />
    <link href="inc/dropstyle.css" rel="stylesheet" type="text/css" />
    <title>Potcake: A Dogumentary</title>
    <style type="text/css" >
            .error { color: red; }
                    input.error { border-color: red; }
                    .item {
                            width: 150px;
                            float: left;
                            margin: 5px;
                    }
                    .cart {
                            clear: both;
                            float: right;
                    }
                    .cart img {
                            width: 20px;
                    }
                    .img-wrapper{
                            height: 150px;
                    }
            </style>
</head>

<body>
    
    <div id ="content">
    	<header>
        	<? include('inc/header.php'); ?>
        </header>
        
    	<nav>
    		<? include('inc/nav.php'); ?>
        </nav>
		
        <div id="shop">
                
             <div id="products">
             
				 <? while($rs = $results->fetch_assoc()): ?>
                        <div class="item">
                            <form method="post" action="store.php">
                                    <div class="img-wrapper">
                                            <img src="media/<?=$rs['id']?>.jpg" />                        
                                    </div>
                                    <h6>
                                            <?=$rs['ProductName']?>
                                    </h6>
                                    <h5>Price: <?=$rs['Price']?></h5>
                                    <input type="hidden" name="Price" value="<?=$rs['Price']?>" />
                                    <input type="hidden" name="id" value="<?=$rs['id']?>" />
                                    <label class="control-label" for="Quantity">Quantity:</label>
                                    <input type="number" name="ProductQuantity" id="ProductQuantity" value="1"
                                            class="required"
                                	/>
                                    <input class="btn btn-small" type="submit" value="+Add to cart">     
                            </form>        
                        </div>  
                <? endwhile; ?>
            </div>

       </div>
       
       <div id="right">
       
       
            	<div id="cart">
        			<h6>Shopping Cart:</h6><br />
                	<b>Number Of Items:</b> <?=$_SESSION['count']; ?><br />
                	<b>Total Cost:</b> <?=$_SESSION['total']; ?><br /><br />
                    <form method="post" action="checkout.php">
                    	<input type="hidden" name="count" value="<?=$_SESSION['count']?>" />
                        <input type="hidden" name="total" value="<?=$_SESSION['total']?>" />
                        <input class="btn btn-small" type="submit" value="Checkout...">
                    </form>
                    <form method="post" action="store.php">
                    	<input type="hidden" name="reset" value="1" />
                        <input class="btn btn-small" type="submit" value="Clear Cart">
                    </form>
        		</div>
                
                
            	<div id="twitter-feed">
					<script charset="utf-8" src="http://widgets.twimg.com/j/2/widget.js"></script>
                    <script>
                          new TWTR.Widget({
                              version: 2,
                              type: 'profile',
                              rpp: 4,
                              interval: 30000,
                              width: 255,
                              height: 200,
                              theme: {
                                  shell: {
                                      background: '#eeeeee',
                                      color: '#000000'
                                  },
                                  tweets: {
                                      background: '#ffffff',
                                      color: '#000000',
                                      links: '#87C9C7'
                                  }
                              },
                              features: {
                                  scrollbar: true,
                                  loop: false,
                                  live: false,
                                  behavior: 'all'
                              }
                          }).render().setUser('PotcakeNation').start();
                    </script>
            	</div>
       </div>
       
       <div id="facebook">
        	<div class="fb-comments" data-href="http://cs.newpaltz.edu/~n02033720/2012WP/final/potcakedocumentary/index.php" data-width="630" data-num-posts="2"></div>
        </div>
        
        
       <div style="clear: both"></div>
            <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/handlebars.js/1.0.rc.1/handlebars.min.js">
            </script>
            
			<script type="text/javascript">
                    $(function(){
                            var t_cart = Handlebars.compile($("#cart_template").html());
                            var t_cart_item = Handlebars.compile($("#cart_item_partial_template").html());
                            var t_products = Handlebars.compile($("#products_template").html());
                            Handlebars.registerPartial('t_cart_item', t_cart_item);
                           
                           
                            $.get('../Api/Products.php', function(data){
                                                    $("#contents").html(t_products(data));
                            },'json');
                           
                            $.get('../Api/Cart.php', function(data){
                                        var values = $.map( data, function( value, index ) {
                                          return value;
                                        });
                                            $("#contents").before(t_cart({items: values}));                
                            },'json');
                           
                            $(".add-to-cart-link").live('click',function(){
                                    $.post(this.href, {_method: 'POST', count: 1}, function(data){
                                            if($("#cart_item_" + data.id).length > 0)
                                                            $("#cart_item_" + data.id).replaceWith(t_cart_item(data));
                                            else
                                                            $(".cart").append(t_cart_item(data));
                                    },'json');
                                    return false;
                            });
                    })
            </script>
            <footer>
                <div id="copyright">
                    &copy Atomic Lizard Services 2012
                </div>
                <div id="icons">
                    <? include('inc/icons.php'); ?>
                </div>
        	</footer>
        </div>
        
       
    </div>
    
    
        

</body>

</html>